<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        /**
         * @description: 
         * @param {*} arr 操作的数组
         * @param {*} index1 准备移动的元素
         * @param {*} index2 移动到的位置  往下移就是 index2=index+1 往上移动就是 index2=index-1；
         * @param {*} direction up->置顶, down->置底
         * @return {*} Array
         */
        const swapItems = function (arr, index1, index2, direction) {
            if (direction == 'up') { //置顶
                arr.unshift(arr[index1]);
                arr.splice(index1 + 1, 1);
                return arr;
            }
            if (direction == 'down') { //置底
                arr.push(arr[index1]);
                arr.splice(index1, 1);
                return arr;
            }
            arr[index1] = arr.splice(index2, 1, arr[index1])[0];
            return arr;
        };
        //然后js调用
        function upIndex(index) { //置顶
            if (index == 0) {
                return;
            }
            swapItems(myAppList, index, 0, 'up');
        }

        function up(index) { //上移
            if (index == 0) {
                console.log('已经是列表中第一个！')
                return;
            }
            swapItems(myAppList, index, index - 1);
        }

        function down(index) { //下移
            if (index == myAppList.length - 1) {
                return;
            }
            swapItems(myAppList, index, index + 1);
        }

        function downIndex(index) { //置底
            if (index == myAppList.length - 1) {
                console.log('已经是列表中最后一个！')
                return;
            }
            swapItems(myAppList, index, 0, 'down');
        }
    </script>
</body>

</html>